<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <title>Title</title>
    <style type="text/css">
        body,html{
        margin:0;
        padding:0;
        }
        .box{
        max-width:750px;
        margin:0 auto;
        overflow-x:hidden;
        }
        .box .boxImg,.box .animate{
        width:100%;
        overflow-x:hidden;
        }
        .boxImg>img,.animate>img{
        width:100%;
        }
        .boxImg>img{
        height:500px;
        }
    </style>

</head>
<body>
<setion class="box">
    <div class="boxImg">
        <img src="qiao.png" alt="">
    </div>
    <div class="animate">
        <img src="1.png" alt="">
        <img src="2.png" alt="">
        <img src="3.png" alt="">
        <img src="4.png" alt="">
    </div>
</setion>
</body>
</html>